// tsc -w ./index.ts

// let canvas = document.getElementById("canvas") as HTMLCanvasElement;
let canvas:HTMLCanvasElement = document.querySelector("#canvas") as HTMLCanvasElement;
let ctx:CanvasRenderingContext2D = canvas.getContext("2d") as CanvasRenderingContext2D;

canvas.width = screen.availWidth;
canvas.height = screen.availHeight;

let str: string[] = "一花一世界一叶一如来菩提本无树明镜亦非台本来无一物何处惹尘埃".split("")
let Arr = Array(Math.ceil(canvas.width / 10)).fill(0)

const rain = () => {
  ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
  ctx.fillRect(0, 0, canvas.width, canvas.height);
  ctx.fillStyle = "#265031";
  ctx.font = "bold 24px Arial";
  Arr.forEach((item, index) => {
    ctx.fillText(str[Math.floor(Math.random() * str.length)], index * 15, item + 40);
    Arr[index] = index > canvas.height || item > 10000 * Math.random() ? 0 : item + 30;
  })
}

setInterval(rain, 100)